<div class="content-section introduction">
    <div>
        <span class="feature-title">值班管理<span class="gt">&gt;</span>排班总览  </span>
    </div>
</div>
<div class="content-section implementation GridDemo" id="manage">
    <!--<div class="ui-widget-header">-->
        <div class="ui-g">
            <div class="">
                <label for="scheduleName">
               计划名称:
                </label>
                <input id="scheduleName" type="text" pInputText  placeholder="请输入计划名" [(ngModel)]="scheduleName"/>
            </div>
            <div>
                <label for="selectedStatus">状态选择:</label>
                <p-dropdown id="selectedStatus" [options]="statusOptions" [(ngModel)]="selectedStatus" placeholder="请选择状态" optionLabel="name" [style]="{'width':'15vw'}"></p-dropdown>
            </div>
            <div>
                <button pButton type="button"  label="查询" (click)="searchSchedule()"  ></button>
                <button pButton type="button"  label="新增计划"  [routerLink]="['/index/duty/add']"></button>
            </div>
        </div>
    <!--</div>-->

    <p-dataTable [value]="scheduleDatas" [responsive]="true" id="manageTable">
        <p-column selectionMode="multiple" ></p-column>
        <p-column field="did" header="计划编号" [sortable]="true">
            <ng-template let-data="rowData" pTemplate="operator">
                <span [routerLink]="['/index/duty/view', data['did']]" (click)="overviewSchdule(data)" class="ui-cursor-point" >{{data.did}}</span>
            </ng-template>
        </p-column>
        <p-column field="name" header="计划名称" [sortable]="true"></p-column>
        <p-column field="create_time" header="创建时间" [sortable]="true"></p-column>
        <p-column field="creator" header="排班人员" [sortable]="true"></p-column>
        <p-column field="begin_time" header="开始时间" [sortable]="true"></p-column>
        <p-column field="end_time" header="结束时间" [sortable]="true"></p-column>
        <p-column field="status" header="状态" [sortable]="true"></p-column>
        <p-column field="approve_time" header="审批时间" [sortable]="true"></p-column>
        <p-column field="approver_structures"   header="审批人" [sortable]="true">
            <ng-template let-data="rowData" pTemplate="test">
                <span>{{data.approver_structures[0].name}}</span>
            </ng-template>
        </p-column>
        <p-column field="color" header="操作" [style]="{'width':'12vw'}">
            <ng-template let-schedule="rowData" pTemplate="operator">
                <button pButton type="button"  (click)="editSchdule(schedule)"
                        *ngIf="(schedule.status == '新建') || (schedule.status == '待审核') || (schedule.status == '驳回') || (schedule.status == '待执行') || (schedule.status == '已过期') || (schedule.status == '处理中')"
                        label="编辑"  [routerLink]="['/index/duty/edit', schedule['did']]" class=" mb_d1vw"></button>
                <button pButton type="button"  (click)="deleteSchdule(schedule)"
                        *ngIf="(schedule.status == '新建') || (schedule.status == '待审核') || (schedule.status == '驳回') || (schedule.status == '待执行') || (schedule.status == '已过期') || (schedule.status == '处理中')"
                        label="删除" ></button>
                <button pButton type="button"  (click)="overviewSchdule(schedule)" label="查看" [routerLink]="['/index/duty/view', schedule['did']]"  class=" mb_d1vw"></button>
                <button pButton type="button"  (click)="approvalSchdule(schedule)"
                        *ngIf="schedule.status == '待审核'"
                        label="审批" [routerLink]="['/index/duty/approval', schedule['did']]"  class=" mb_d1vw"></button>
            </ng-template>
        </p-column>
        <ng-template pTemplate="emptymessage">
            当前没有数据
        </ng-template>
    </p-dataTable>
    <p-paginator rows="10" totalRecords="{{total}}" [rowsPerPageOptions]="[10,20,30]" pageLinkSize="{{page_total}}"  (onPageChange)="paginate($event)"></p-paginator>
    <p-growl [(value)]="msgs"></p-growl>
    <p-growl [(value)]="deletemsgs"></p-growl>
    <p-dialog header="删除确认框" [(visible)]="dialogDisplay" modal="modal" width="300" [responsive]="true">
        确认删除吗？
        <p-footer>
          <button type="button" pButton icon="fa-check" (click)="sureDelete()" label="确定"></button>
          <button type="button" pButton icon="fa-close" (click)="dialogDisplay=false" label="取消" class="ui-button-secondary"></button>
        </p-footer>
    </p-dialog>
</div>
